#{extends 'main.html' /}
#{set title:'首页设置' /}
<style>
    .cardAdd_btn {
        height: auto;
        overflow: hidden;
        margin: 1rem 0.5rem;
        text-align: center;
    }

    .cardAdd_btn img {
        width: 30%;
        border-radius: 100%;
        display: block;
        margin: 0 auto;
    }

    .cardAdd_btn p {
        color: #666;
        font-size: 0.75rem;
        margin-top: 0.5rem;
    }
</style>
</head>
<body>
<div class="page-group">
    <div class="page">
        <header class="bar bar-nav0">
            <a href="#" class=" hlogo"></a>
            <div class="searchbar">
                <div class="search-input">
                *{    <label class="icon icon-search" for="search"></label>}*
                *{    <input type="search" id='search' readonly placeholder='输入关键字...'/>}*
                </div>
            </div>
        </header>
        <section id="page-swiper" class="content scroll_y" style=" top:0; padding-bottom:3rem;">
            <div class="swiper-container lunbo">
                <div class="swiper-wrapper" onclick="window.open('/index/banner','_self')">
                    #{if blockActivity != null && blockActivity.activityProducts.size()> 0}
                    #{list blockActivity.activityProducts , as:'block'}
                        <div class="swiper-slide"><img src="${block?.imgSrc}" alt=""></div>
                    #{/list}
                    <div class="swiper-slide"><img src="/public/sui/images/pic_add1.jpg" alt=""></div>
                    #{/if}
                    #{else }
                    <div class="swiper-slide"><img src="/public/sui/images/pic_add1.jpg" alt=""></div>
                    #{/else}

                </div>
                <div class="swiper-pagination"></div>
            </div>

            <div class="notice m6" >
                <div class="notice_t pull-left"><strong>商户公告</strong><span>|</span></div>
                <div class="swiper-container scroll-uptext" onclick="window.open('/index/notice','_self')">
                    <div class="swiper-wrapper">
                        #{if noticeActivity != null}
                        #{list noticeActivity.activityProducts , as:'notice'}
                        <div class="swiper-slide"><a href="#">${notice?.title}</a></div>
                        #{/list}
                        #{/if}
                        #{else }
                        <div class="swiper-slide"><a href="#">店家太懒,还没添加~~~</a></div>
                        #{/else}

                    </div>
                </div>
            </div>

            <div class="s_kill m6">
                <div class="kill_t"><strong class="pull-left">限时秒杀</strong><span class="pull-left">${seckillActivity?.beginAt?.format('yyyy-MM-dd HH:mm')}开始</span><a
                        href="#" class="more pull-right"></a></div>
                <div class="kill_c" onclick="window.open('/index/seckill','_self')">
                    #{if seckillActivity != null}
                    #{list seckillActivity.activityProducts ,as : 'seckill'}
                        #{if seckill?.product?.reviewStatus.toString() == 'NORMAL'}
                            <a href="#"><em class="radius5p">抢</em><img src="${seckill?.product?.mainImage}">
                                <h3>${seckill?.product?.name}</h3>
                                <p><i>￥${seckill?.activityPrice}</i>/${seckill?.product?.spec}</p></a>
                        #{/if}
                    #{/list}
                    #{/if}
                    #{else }
                    <a href="#"><em class="radius5p">抢</em><img src="/public/sui/images/btn_add.png">
                        <h3>商品名称</h3>
                        <p><i>￥价格</i>/规格</p></a>
                    #{/else}
                </div>
            </div>
            <div class="s_pic" onclick="window.open('/index/promotion','_self')">
            #{if promotionActivity != null}
                <a href="#"><img proId="${promotionActivity?.id}" src="${promotionActivity?.mainImg}"/></a>
            #{/if}
            #{else }
                <a href="#"><img src="/public/sui/images/pic_add2.jpg"/></a>
            #{/else}
            </div>

            #{list recommendActivityList , as : 'recommend'}
                <div class="card0 mainbox1 m6" onclick="window.open('/index/recommend/${recommend?.id}','_self')">
                    <div class="card-header">
                        <a href="#">
                            <h3 class="pull-left">${recommend?.title}   #{if recommend?.subtitle}| <span>${recommend?.subtitle}</span>   #{/if}</h3>
                            <img src="${recommend?.mainImg}"/>
                        </a>
                    </div>
                    <div class="card-content">
                        <ul class="card_list">
                            #{if recommend != null}
                            #{list recommend.activityProducts , as :'product'}
                                #{if product?.product?.reviewStatus.toString() == 'NORMAL'}
                                    <li><a href="#">  #{if product?.product?.mainImage }<img src="${product?.product?.mainImage}">   #{/if}</a>
                                        <h3>${product?.product?.name}</h3><span>${product?.product?.spec}/${product?.product?.unit}</span>
                                        <p>
                                            <em>￥${product?.product?.merchantPrice}</em>
                                            *{<i>￥3.2</i>}*
                                        </p>
                                    </li>
                                #{/if}
                            #{/list}
                            #{/if}

                        </ul>
                    </div>
                </div>
            #{/list}
            <div class="cardAdd_btn">
                <a href="/index/recommend" external><img src="/public/sui/images/btn_add.png"/></a>
                <p>添加产品版块</p>
            </div>
        </section>

    #{include 'footer.html'/}
    </div>


</div>

<script type="text/javascript">
    $.init();
    $(".lunbo").swiper({
        autoplay: 3000  //可选选项，自动滑动
    });
    $(".scroll-uptext").swiper({
        direction: 'vertical',
        autoplay: 3000  //可选选项，自动滑动
    });


    // 检测高度

    $(".content").on("scroll", function () {
        if ($('.content').scrollTop() > 100) {
            $('.bar-nav0').addClass("active");
        } else {
            $('.bar-nav0').removeClass("active");
        }
    });


</script>
</body>
